

// 嵌套路由
import {Switch,Route, Redirect , Link } from "react-router-dom" 
export class Nested extends Component{
  render(){
    return (
      <div>
        <h2>  Nested - Nested-  Nested 嵌套路由 </h2>
        <p>你有多少层嵌套就写多少个  Route  </p>
        <hr/>
        <div>
          <Switch>
             {/* <Route path="/nested" render={()=><Redirect to="/nested/one" />  }/> */}
             <Route path="/nested/:type?" component={Child}   />
             {/* <Route path="/nested/two" component={Child}   />
             <Route path="/nested/three" component={Child}   /> */}
          </Switch>
        </div>
        <div>
          <p> <Link to="/nested/one?uid=2001"> One </Link></p>
          <p> <Link to="/nested/two?uid=2002"> Two  </Link></p>
          <p> <Link to="/nested/three?uid=2003"> Three </Link></p>

        </div>
      </div>
    )
  }
}

const  Child  = ({match,location })=> (
   <div>
     <h2> Child -  child - child </h2>
     <h2> type == {match.params.type  || 'null '}</h2>
     <h2>uid--  {new URLSearchParams(location.search).get('uid')} </h2>
   </div>
)